// import {useState} from "react";
import {useImmer} from "use-immer";

const ChangeStateObject = ()=>{
    const [userinfo,setUserinfo] = useImmer({
        name:'张三',
        age:'李四'
    })
    const changeName = (e)=>{
        setUserinfo(draft => draft.name=e.target.value)
    }

    const changeAge = (e)=>{
        setUserinfo(draft => draft.age=e.target.value)
    }
    return (
        <>
            <input onChange={changeName} placeholder={'Input Your Name'} value={userinfo.name}/>
            <br/>
            <input onChange={changeAge} placeholder={'Input Your Age'} value={userinfo.age}/>
            <br/>
            <button onClick={()=>{
                setUserinfo(draft => {
                    draft.name = 'xxx'
                    draft.age = 'NaN'
                })
            }}>一键修改</button>
        </>
    )
}

export default ChangeStateObject